var Arrow = function (divElm) {

	var timer;
	var xNum = 3;
	var yNum = 3;
	var angles = [];
	var arrows = [];
	var state = 'wait';

	function init() {
		if (state === 'wait') {
			for (var i = 0; i < xNum; i ++) {
				for (var j = 0; j < yNum; j ++) {
				
					var x = i * 250 + Math.round(Math.random() * 110) + 265;
					var y = j * 250 + Math.round(Math.random() * 110) + 20 + 25;
					var r = Math.round(Math.random() * 360);
					var imgElm = document.createElement('img');
					var arrow = {
						x: x,
						y: y,
						r: r,
					}
					imgElm.src = "img/arrow.png";
					imgElm.width = 140;
					imgElm.height = 100;
					imgElm.style.cssText = 'position: absolute; background: none; left: ' + x + 'px; top: ' + y + 'px; -webkit-transform: rotate(' + r + 'deg); -moz-transform: rotate(' + r + 'deg); -ms-transform: rotate(' + r + 'deg); -webkit-transition: -webkit-transform 200ms ease-in-out 0; -moz-transition: -moz-transform 200ms ease-in-out 0; -ms-transition: -ms-transform 200ms ease-in-out 0;';
					angles[i*yNum + j] = (Math.atan((y + 100) / (x-512))) * 180 / Math.PI;
					arrows.push(arrow);
				
					if (0 < angles[i*yNum + j]) {
						angles[i*yNum + j] -= 180;
					}
					divElm.appendChild(imgElm);
				}
			}
		timer = setInterval(function(){ setAngle();}, 200);
		}
	}

	function restart() {
		if (state === 'wait') {
			for (var i = 0; i < xNum; i ++) {
				for (var j = 0; j < yNum; j ++) {
					var x = i * 250 + Math.round(Math.random() * 110) + 265;
					var y = j * 250 + Math.round(Math.random() * 110) + 20 + 25;
					var r = Math.round(Math.random() * 360);
					var imgElm = divElm.children[i*yNum + j];
					var arrow = {
						x: x,
						y: y,
						r: r,
					}
					imgElm.style.cssText += ';left: ' + x + 'px; top: ' + y + 'px; -webkit-transform: rotate(' + r + 'deg); -moz-transform: rotate(' + r + 'deg); -ms-transform: rotate(' + r + 'deg);';
					angles[i*yNum + j] = (Math.atan((y + 100) / (x-512))) * 180 / Math.PI;
					if (0 < angles[i*yNum + j]) {
						angles[i*yNum + j] -= 180;
					}
					arrows[i*yNum + j] = arrow;
				}
			}
		timer = setInterval(function(){ setAngle();}, 200);
		}

	}

	function detection() {
		clearInterval(timer); 
		for (var i = 0; i < xNum; i ++) {
			for (var j = 0; j < yNum; j ++) {
				var r = angles[i*yNum + j];
				//console.log(r, i, j);
				divElm.children[i*yNum + j].style.cssText += '-webkit-transform: rotate(' + r + 'deg); -moz-transform: rotate(' + r + 'deg); -ms-transform: rotate(' + r + 'deg); opacity: 1.0; -webkit-transition: -webkit-transform 200ms ease-out 0; -moz-transition: -moz-transform 200ms ease-out 0; -ms-transition: -ms-transform 200ms ease-out 0;';
			}
		}
	}


	function setAngle() {
		for (var i = 0; i < xNum; i ++) {
			for (var j = 0; j < yNum; j ++) {
				if (Math.random() < 0.33) {
					var r = arrows[i*yNum + j].r;
					r += Math.floor(Math.random() * 90);
					var opacity = r / 360;

					divElm.children[i*yNum + j].style.cssText += '-webkit-transform: rotate(' + r + 'deg); -moz-transform: rotate(' + r + 'deg); -ms-transform: rotate(' + r + 'deg);';// opacity: ' + opacity + ';';
				}
			}
		}
	}
	return {
		init: init,
		detection: detection,
		restart: restart
	}
};
